<template>
	<view class="bossx">
			<emptyState></emptyState>
		<view class="agreement-confirm-main-box" v-if="flagxs">
			<view class="agreement-confirm-box">
				<view class="title">用户协议及隐私保护</view>
				<view class="content">
					已阅读并同意
					<!-- <text class="tip" @click="gotoWebUrl('https://passport.ximalaya.com/page/privacy_policy')">《隐私信息保护政策》</text> -->
					<text class="tip"  @click="showx=true">《隐私保护指引》</text>
					<text class="tip" @click="flags=true">《产品说明》</text>
					等内容
				</view>
		
				<view class="submit-btn" @click="okHandler">同意并继续</view>
				<view class="cancel-btn" @click="flagxs=false">不同意</view>
			</view>
		</view>
		<view>
			<view class="rule-box">
				<view class="rule-img">
					<image class="" style="width: 40rpx;" mode="widthFix" @click="flags=true":src="baseImagePath + 'rule-icon.png'">
					</image>
				</view>
			
			
					<image class="rule-imgs" mode="widthFix" :src="baseImagePath + 'quanyi-icon.png'" @click="gotoQuanyi">
					</image>
				
				<image class="rule-imgs" mode="widthFix" @click="telMobile" :src="baseImagePath + 'tel-icon.png'"></image>
		
			
		
			</view>
		
		</view>
		<view class="agreement-main-box" v-if="showx" style="z-index: 99999;">
			<view class="agreement-box">
				<view class="title">{{title}}</view>
				<view class="content-box">
					<view class="content" v-for="item in content">
						{{item}}
					</view>
				</view>
				<view class="btn" @click="showx=false">我知道了</view>
			</view>
		</view>
		<view class="agreement-main-box" v-if="flags" style="z-index: 99999;">
			<view class="agreement-box">
				<view class="title">{{title1}}</view>
				<view class="content-box">
					<view class="content" v-for="item in content1">
						{{item}}
					</view>
				</view>
				<view class="btn" @click="flags=false">我知道了</view>
			</view>
		</view>
		<u-popup v-model="show" mode="center" width="90%"  >
			<view class="" style="background-color: white;border-radius: 30rpx;padding: 0 20rpx;">
				<u-select v-model="shows" :list="list" @confirm="confirm" title="储蓄卡"></u-select>
				<view class="" style="padding:50rpx 30rpx;">
					<view class="" style="width: 100%;color: #070707;text-align: center;font-size: 36rpx;">
						绑定银行卡
					</view>
					<u-form :model="form" ref="uForm" label-width="130rpx">
						<u-form-item label="姓名"><u-input v-model="form.name"  placeholder="输入持卡姓名"
								@input="name" /></u-form-item>
						<u-form-item label="手机"><u-input v-model="form.phone" type="number" placeholder="输入银行卡绑定手机号"
								 /></u-form-item>
						<view class="" >
							<u-form-item label="身份证" ><u-input v-model="form.number" 
									placeholder="输入银行卡绑定身份证号" /></u-form-item>
									<u-form-item label="银行类型" ><u-input v-model="form.yinhang" placeholder="选择银行类型"
											type="select" @click='shows=true' /></u-form-item>
						</view>



				

					</u-form>
					<image src="https://web.78keji.cn/images/sx/ljj/btn.png" mode="widthFix"
						style="width: 100%;margin-top: 50rpx;" @click="tijiao"></image>
				
				</view>
			</view>


		</u-popup>
		<view class="">
			<image src="https://web.78keji.cn/images/sx/ljj/t.png" mode="widthFix"
				style="width: 100%;"></image>

		
			<view class=""
				style="z-index: 9999;width: 267rpx;display: flex;width: 100%;align-items: center;justify-content: center;margin-top: -220rpx;">
				<button class="mobile-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
					<image src="https://web.78keji.cn/images/sx/ljj/btn.png" mode="widthFix" class="submit-btn"></image>
				</button>




			</view>
			<view class="" style="z-index: 9999;width: 267rpx;display: flex;width: 100%;align-items: center;padding: 0 70rpx;font-size: 24rpx;margin-top: 50rpx;">
			
				<u-checkbox-group>
					<u-checkbox v-model="value" shape="circle" style="border: 1px solid red;"> </u-checkbox>
			
				</u-checkbox-group>
				
				<view class="">
					我已详细阅读并同意
				<text style="color:#FA0A46 ;" @click="showx=true">《隐私保护指引》</text>
				<text @click="change" style="color:#FA0A46 ;">《用户协议》</text> 
					<text style="color:#FA0A46 ;" @click="flags=true">《产品说明》</text> 
				</view>
			
			</view>

		</view>
		<view class="" style="width: 100%;text-align: center;margin-top: 46rpx;">
			<image src="https://web.78keji.cn/images/sx/ljj/quanyi.png" mode="widthFix"
				style="width: 90%;"></image>
		</view>
		<view class="tip-color">
			业务资费：连续包月49.9元/月(可随时取消)
		
		</view>
		<view class="tip-color">
		续订权益：50元支付宝立减金+keep会员月卡+100元团油加油券
	
		</view>
		<view class="tip-color">
			客服热线：400-8825-101		
		</view>
		<view class="" style="height: 10rpx;">
			
		</view>
	
	</view>
</template>

<script>
	import {
		signTest,
		tongji
	} from '../../api/index.js'
	import mobileApi from "../../api/mobileApi";
	import paramApi from "../../api/paramApi";
	import httpUtil from "../../utils/httpUtil";
import zfbUrlUtil from "../../utils/zfbUrlUtil";
	export default {
		data() {
			return {
				flagxs:false,
				baseImagePath:'https://web.78keji.cn/images/sx/ljj/',
				flagx: false,
				flags: false,
				title1: '活动规则',
				content1: [
					'1.活动时间：2024.11.01-2025.12.31',
					'2.产品名称：省心购PLUS',
					"3.客服咨询：400-8825101（工作日9:00-12:00 13:30-6:00）",
					'4.活动对象：通过正常通道进入活动且未参与过该活动的用户均可参与（每人限购1单）',
					'5.产品资费：本产品在您完成订阅操作后可享首周免费体验，体验期内如您未取消订阅，我们将在体验期结束后自动升级为正式会员，并扣费49.9元/月续订该会员，您可随时取消该订阅。扣费采用签约代扣的方式进行收费，会在每一个计费周期到期前24小时，自动从您的账户中扣费（请确保余额充足）。如对产品有异议或者建议等，请联系客服登记处理。',

					"6.权益说明：",
					"(1)体验会员包含1张5元立减金，1张keep会员周卡；",
					"(2)正式会员包含1张keep会员月卡，50元支付宝立减金,100元团油加油券。",
					"注：keep会员月卡在您领取后默认充值到您订购时的手机号所对应注册的keep账号下，不支持更换手机号进行会员权益的领取，所以请务必确保您的keep账号已绑定本号码，否则keep侧不支持任何形式的会员换绑操作；支付宝通用立减金可用于线上线下任意支付宝支付场景，使用支付宝支付，且金额大于5元，使用6大银行卡付款时均可自动抵扣；团油加油券需到“省心24”公众号登录订购手机号码自行领取兑换码。",
					"7.权益领取：",
					"①1张5元支付宝立减金，将直接到账您订购时填写的手机号注册的支付宝账户-卡包（该产品为虚拟商品请填写正确手机号），使用有效期为订阅后24小时内（逾期不予补发，请注意效期内使用）。",
					"②1keep会员周卡请前往微信公众号“省心24”领取您的会员周卡（领取方式详见短信）。",
					'(2)正式会员包括1张keep会员月卡+50元支付宝立减金+100元团油加油券。',
					'①1张keep会员月卡，领取后默认充值到订购时的手机号对应注册的keep账号下。',
					'②50元支付宝立减金',
					"权益领取：您可以前往微信公众号“省心24”，会员中心登录并领取会员及立减金（领取详情见阅短信）。注意：省心会员领取后会到账您订购时填写的手机号对应注册的省心账号下；立减金领取后也会同步发放到您订购时填写的手机号注册的支付宝账户。该产品为虚拟商品请谨慎填写账号。",
					'③100元团油加油券',
					'a.请前往微信公众号“省心24-领福利-立减金”领取您的加油券（领取详情见阅短信）。',
					'b.领取成功后，登录团油app或团油小程序，点击我的-优惠券，即可查看权益并使用。',
					'8.取消订阅/续订：如需解约本产品，请在会员权益到期前联系客服',
					'9.退费说明：联合产品属虚拟类商品，非预付卡，不适用无理由退货，开通成功后，不支持退款和转移，联合产品权益不可转让。',
					'10.严禁以任何形式翻录或转载、未经许可在第三方平台传播，违者将追究法律责任。',
					'11.您在购买自动续费服务后，将会在到期前1天为您发起续费，自动延长一个keep会员有效期及省心购50元支付宝立减金权益；您可随时在支付宝-支付设置内取消，取消后则不再发起续费，在keep与第三方合作发生变更或终止时，您的订购服务将自动解约，以届时实际通知为准。',
					"12.特别提醒",
					"(1)购买本联合产品，应同时遵守keep和省心购产品各自发布的《用户服务协议》、《隐私权政策》、《会员服务协议》（统称“平台规则”），如违反任一平台规则，省心购产品和keep任何一方均有权单独按照其平台规则的规定进行处理，包括但不限于中止或终止提供其所属平台的服务及要求侵权赔偿等。故在开通前，请仔细阅读两个平台的规则。",
					"(2)用户信息保护：为您领取权益目的，keep和省心购产品会收集使用您的相关信息。当您购买联合产品并手动勾选相关服务协议后，表明您接受并同意收集使用您的个人信息。活动主办方使用个人信息仅限于购买、领取、使用联合产品所需，并在合理范围内予以保护，详细个人信息政策请阅keep和省心购产品《隐私权政策》及《用户服务协议》。如您不同意请不要参与本次活动。",
					"(3)互联网存在诸多不确定性因素，因此理解并同意，如因不可抗力、网络、通讯线路故障、计算机大规模瘫痪及活动中存在大面积作弊行为等非keep及省心购产品原因致使本活动出现异常情况或难以继续开展的，活动主办方有权采取包括但不限于通过各种方式消除异常情况或调整、暂停、取消本活动等措施，因此造成用户损失的，keep和省心购不承担责任。",
					'(4)如出现不可抗力或情势变更的情况（包括但不限于重大灾害事件，活动受政府机关指令需要停止举办或调整的，活动遭受严重网络攻击或因系统故障导致包括但不限于活动中断、停办、权益领取和使用出现问题），活动主办方可依据相关法律法规的规定主张免责，主办方拥有取消本次活动的权利。',
					'(5)在法律规定的范围内，keep和省心购有权对活动规则进行解释，并根据活动的实际情况对本活动的规则进行变动或调整，相关变动或调整将公布在本活动规则页面，公布后依法生效。',
					'(6)如果用户出现违规行为（如作弊领取、恶意套现、刷取信誉、虚假交易、以所获得权益进行盈利、不当使用、倒买倒卖等违背诚实信用的行为），活动主办方将取消收回全部权益（含已使用的及未使用的），必要时追究法律责任。'

				],
				title: '隐私保护指引',
				content: [
				"用户协议",
				"尊敬的用户，欢迎使用由成都净蓝科技有限公司（下列简称为“净蓝科技”）提供的服务。在使用前请您阅读如下服务协议，使用本应用即表示您同意接受本协议，本协议产生法律效力，特别涉及免除或者限制净蓝科技责任的条款，请仔细阅读。如有任何问题，可向净蓝科技咨询。",
				"1. 服务条款的确认和接受",
				"通过访问或使用本应用，表示用户同意接受本协议的所有条件和条款。",
				"2. 服务条款的变更和修改",
				"净蓝科技有权在必要时修改服务条款，服务条款一旦发生变更，将会在重要页面上提示修改内容。如果不同意所改动的内容，用户可以放弃获得的本应用信息服务。如果用户继续享用本应用的信息服务，则视为接受服务条款的变更。本应用保留随时修改或中断服务而不需要通知用户的权利。本应用行使修改或中断服务的权利，不需对用户或第三方负责。",
				"3. 用户行为",
				"3.1 用户账号、密码和安全",
				"您需注册登录账号方可使用我司产品功能。",
				"3.2 账号注册时的禁止行为",
				"（1）请勿以党和国家领导人或其他社会名人的真实姓名、字号、艺名、笔名注册；",
				"（2）冒充任何人或机构，或以虚伪不实的方式谎称或使人误认为与任何人或任何机构有关的名称；",
				"（3）请勿注册和其他网友之名相近、相仿的名字；",
				"（4）请勿注册不文明、不健康名字，或包含歧视、侮辱、猥亵类词语的名字；",
				"（5）请勿注册易产生歧义、引起他人误解的名字；",
				"3.3 用户在本应用上不得发布下列违法信息和照片：",
				"（1）反对宪法所确定的基本原则的；",
				"（2）危害国家安全，泄露国家秘密，颠覆国家政权，破坏国家统一的；",
				"（3）损害国家荣誉和利益的；",
				"（4）煽动民族仇恨、民族歧视，破坏民族团结的；",
				"（5）破坏国家宗教政策，宣扬邪教和封建迷信的；",
				"（6）散布谣言，扰乱社会秩序，破坏社会稳定的；",
				"（7）散布淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪的；",
				"（8）侮辱或者诽谤他人，侵害他人合法权益的；",
				"（9）含有法律、行政法规禁止的其他内容的；",
				"（10）禁止骚扰、毁谤、威胁、仿冒网站其他用户；",
				"（11）严禁煽动非法集会、结社、游行、示威、聚众扰乱社会秩序；",
				"（12）严禁发布可能会妨害第三方权益的文件或者信息，例如（包括但不限于）：病毒代码、黑客程序、软件破解注册信息。",
				"（13）禁止上传他人作品。其中包括你从互联网上下载、截图或收集的他人的作品；",
				"（14）禁止上传广告、横幅、标志等网络图片；",
				"4. 服务内容",
				"本服务的具体内容由净蓝科技根据实际情况提供，净蓝科技可以对其提供的服务予以变更，且净蓝科技提供的服务内容可能随时变更。",
				"",
				"隐私条款",
				"1.用户信息公开情况说明",
				"尊重用户个人隐私是净蓝科技的一项基本政策。所以，净蓝科技不会在未经合法用户授权时公开、编辑或透露其注册资料及保存在本应用中的非公开内容，除非有下列情况：",
				"（1）有关法律规定或净蓝科技合法服务程序规定；",
				"（2）在紧急情况下，为维护用户及公众的权益；",
				"（3）为维护净蓝科技的商标权、专利权及其他任何合法权益；",
				"（4）其他需要公开、编辑或透露个人信息的情况；",
				"在以下（包括但不限于）几种情况下，启奔科技有权使用用户的个人信息：",
				"（1）在进行促销或抽奖时，净蓝科技可能会与赞助商共享用户的个人信息，在这些情况下净蓝科技会在发送用户信息之前进行提示，并且用户可以通过不参与来终止传送过程；",
				"（2）净蓝科技可以将用户信息与第三方数据匹配；",
				"（3）净蓝科技会通过透露合计用户统计数据，向未来的合作伙伴、广告商及其他第三方以及为了其他合法目的而描述净蓝科技的服务；",
				"2.隐私权政策适用范围",
				"（1）用户在使用本应用服务器时留下的个人身份信息；",
				"（2）用户通过本应用服务器与其他用户或非用户之间传送的各种资讯；",
				"（3）本应用与商业伙伴共享的其他用户或非用户的各种信息；",
				"（4）净蓝科技软件十分注重保护用户的个人隐私，并制定了《隐私政策》，用户亦可以通过《隐私政策》，用户确认并同意使用净蓝科技软件提供的服务将被视为接受《隐私政策》。",
				"3.资讯公开与共享",
				"净蓝科技不会将用户的个人信息和资讯故意透露、出租或出售给任何第三方。但以下情况除外：",
				"（1）用户本人同意与第三方共享信息和资讯;",
				"（2）只有透露用户的个人信息和资讯，才能提供用户所要求的某种产品和服务;",
				"（3）应代表本应用提供产品或服务的主体的要求提供（除非我们另行通知，否则该等主体无权将相关用户个人信息和资讯用于提供产品和服务之外的其他用途）：根据法律法规或行政命令的要求提供;因外部审计需要而提供;用户违反了本应用服务条款或任何其他产品及服务的使用规定;经本站评估，用户的帐户存在风险，需要加以保护。",
				"4.非个人隐私信息",
				"为了改善净蓝科技软件的技术和服务，向用户提供更好的服务体验，净蓝科技或可会自行收集使用或向第三方提供用户的非个人隐私信息。",
				"5.如何联系我们",
				"您可以通过以下方式与我们联系，我们将在15天内回复您的请求：",
				"（1）如对本政策内容、个人信息有任何疑问、意见或建议，您可通过净蓝科技客服邮箱：【912716425@qq.com】与我们联系。",
				"（2）如发现个人信息可能被泄露，您可以联系我们的客服人员进行投诉举报；",
				"如果您对我们的回复不满意，特别是您认为我们的个人信息处理行为损害了您的合法权益，您还可以通过向被告住所地有管辖权的法院提起诉讼来寻求解决方案。",
				],
				showx: false,
				keyCardShow: false,
				flags: false,
				BANK_TYPE: '00',
				lists: [{
						name: '银行卡',
						id: '00',
						disabled: false
					},
					{
						name: '信用卡',
						id: '02',
						disabled: false
					},
				],
				flag: false,
				scrollTop: 0,
				shows: false,
				value: false,
				a: "",
				BANK_CODE: "", //银行编码
				BANK_NAME: "", //银行名字
				list: [{
						value: "0103",
						label: "中国农业银行"
					},
					{
						value: "0104",
						label: "中国银行"
					},
					{
						value: "0105",
						label: "中国建设银行"
					},

					{
						value: "0301",
						label: "交通银行"
					},
					{
						value: "0302",
						label: "中信银行"
					},

					{
						value: "0304",
						label: "华夏银行"
					},

					{
						value: "0306",
						label: "广东发展银行"
					},
					{
						value: "0307",
						label: "平安银行"
					},
					{
						value: "0310",
						label: "上海浦东发展银行"
					},
					{
						value: "0403",
						label: "中国邮政储蓄银行"
					}




				],
				timestamp: 299,
				show: false,
				form: {
					name: '',
					phone: '',
					number: '',
					yinhang: ''
				},


				radio: '',
				switchVal: false,
				param: ''

			}
		},
		components: {

		},
		methods: {
		
			getPhoneNumber(e) {
				console.log('getPhoneNumber', e)
				mobileApi.getZfbAuthorizeMobile(e.detail.encryptedData, e.detail.sign, resMobile => {
					this.form.phone = resMobile
					// this.formData.isAgreement = true
					uni.setStorageSync('mobile', resMobile)
					if(this.value==true){
						this.add()
					}else{
						this.flagxs=true
						this.value=true
					}

				})
			},
		telMobile() {
			uni.makePhoneCall({
				phoneNumber: '4008825101'
			})
		},
		gotoQuanyi() {
			if (this.form.phone) {
				let targetUrl = zfbUrlUtil.wrapUrl('https://web.78keji.cn/newlq/#/?mobile=' +this.form.phone)
				
				console.log('gotoQuanyi', targetUrl)
				my.ap.openURL({
					url: targetUrl,
					success: (res) => {
						console.log('openURL success', res)
					},
					fail: (err) => {
						console.log('openURL success', err)
					}
				});
			} else {
		
				uni.showToast({
					title: '请先点击办理获取手机号',
					icon: 'none', //将值设置为 success 或者 ''
					duration: 2000 //持续时间为 2秒
				})
			}
		},
		

			name() {

				if (this.form.name != '' && this.form.phone.length == 11) {
					this.flagx = true
				} else {
					this.flagx = false
				}

			},
		

			top() { //回到顶部
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 300
				});
			},
			onPageScroll(e) { //根据距离顶部距离是否显示回到顶部按钮
				console.log(e)
				if (e.scrollTop > 600) {
					this.flag = true
				} else {
					this.flag = false
				}
				// if(e.scrollTop>900){ //当距离大于600时显示回到顶部按钮
				// 	this.flag=true
				// }else{ //当距离小于600时隐藏回到顶部按钮
				// 	this.flag=false
				// }
			},
okHandler(){
	this.add()
},
			tijiao() {
				if (this.form.name == '') {
					uni.showToast({
						icon: 'none',
						title: '姓名为空',
						duration: 2000
					});
				} else if (!this.form.number.match(
						/^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/)) {
					wx.showToast({
						title: '身份证格式不正确',
						icon: 'none'
					});

				} else if (this.BANK_CODE == '') {
					uni.showToast({
						icon: 'none',
						title: '请选择绑定银行',
						duration: 2000
					});
				} else {
					uni.showLoading({
						title: '绑定中，请稍等',
						mask: true
					});
					console.log(1111)
					for (var i in this.list) {
						if (this.list[i].value == this.BANK_CODE) {
							this.BANK_NAME = this.list[i].label
						}
					}
					signTest({
						a: httpUtil.getA(),
						ACCOUNT_NAME: this.form.name,
						ID: this.form.number,
						TEL: this.form.phone,
						BACKURL:'https://web.78keji.cn/newlq/#/?mobile=' +this.form.phone,
						BANK_CODE: this.BANK_CODE,
						BANK_NAME: this.BANK_NAME,
						BANK_TYPE: this.BANK_TYPE,
						proType: 3,
						param: paramApi.getParam(),
							proCode:'ZY1513',
							mode:"2",
							uuid:uni.getStorageSync('uuid')
					}).then((res) => {
						console.log(res.data)
						uni.hideLoading()

					
					let url = zfbUrlUtil.wrapUrl(res.data.URL)
					console.log('跳转url', url);
										
					// #ifdef MP-ALIPAY
					my.ap.openURL({
						url: url,
						success: (res) => {
							console.log('openURL success', res)
						},
						fail: (err) => {
							console.log('openURL success', err)
						}
					});
					// #endif

					}).catch((err) => {
						uni.hideLoading()
						console.log(err)
						uni.showToast({
							icon: 'none',
							title: err.data.msg,
							duration: 2000
						});
					})
				}

			},
			confirm(e) {
				console.log(e);
				this.form.yinhang = e[0].label
				this.BANK_CODE = e[0].value
				this.value = true
				this.tijiao()
			},
			change() {
					let url = zfbUrlUtil.wrapUrl('https://web.78keji.cn/xieyi/#/')
			my.ap.openURL({
				url: url,
				success: (res) => {
					console.log('openURL success', res)
				},
				fail: (err) => {
					console.log('openURL success', err)
				}
			});

			},
			add() {

				this.show = true

			},
			uuid() {
			    var s = [];
			    var hexDigits = "0123456789abcdef";
			    for (var i = 0; i < 36; i++) {
			        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
			    }
			    s[14] = "4";  // bits 12-15 of the time_hi_and_version field to 0010
			    s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);  // bits 6-7 of the clock_seq_hi_and_reserved to 01
			    s[8] = s[13] = s[18] = s[23] = "-";
			 
			    var uuid = s.join("");
				uni.setStorageSync('uuid', uuid)
			    return uuid;
			},

		},
		onLoad(option) {
			my.hideBackHome()
			
			paramApi.initData(option)

	
 setTimeout(() => {
 tongji({
 	a: httpUtil.getA(),
 	proCode:'ZY1513',
 	mode:"2",
 	uuid:this.uuid()
 }).then((res)=>{
 	
 })
}, 1000);
 

		},
		watch: {

		},
		computed: {

		}
	}
</script>

<style scoped lang='scss'>
	.tip-color{
		letter-spacing: 2rpx;
		font-size: 20rpx;
		color: #000000;
		text-align: center;
		margin-top: 10rpx;
	}
	.bossx{
		position: relative;
		min-height: 100vh;
		background-color: #FFEEE2;
	}
	@keyframes butChange {
		0% {
			transform: scale(1);
		}

		50% {
			transform: scale(1.1);
		}

		100% {
			transform: scale(1);
		}
	}

	.top {
		position: relative;
		display: none;
		/* 先将元素隐藏 */
	}

	.bts {
		animation: butChange 1s infinite;
	}

	.topc {
		position: fixed;
		right: 10%;

		bottom: 20rpx;

		width: 80%;
		height: 180rpx;
		z-index: 99999;
		animation: butChange 1s infinite;
	}

	@keyframes hand {

		0%,
		100% {
			transform: translateX(0) translateY(0);
		}

		50% {
			transform: translateX(0.5rem) translateY(0.5rem);
		}
	}



	.hands {
		animation: hand 1s ease .7s infinite;
	}

	.agreement-main-box {

		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		display: flex;
		justify-content: center;
		align-items: center;
		background: url("https://qiming-1308147483.cos.ap-chengdu.myqcloud.com/doc%2Fpinzhi_shenghuo_huiyuan_quanyi%2Fcommon%2Flogin-shadow-bg.png") repeat;
		z-index: 9999;

		.agreement-box {
			border-radius: 20rpx;
			background-color: #faf7f2;
			padding: 30rpx;
			width: 85%;
			box-sizing: border-box;

			.title {
				text-align: center;
				color: #f94439;
				font-size: 28rpx;
				padding-bottom: 20rpx;
			}

			.content-box {
				max-height: 50vh;
				overflow: auto;

				.content {
					font-size: 25rpx;
					color: #515151;
					margin-top: 30rpx;
					line-height: 45rpx;
				}

			}

			.btn {
				width: 300rpx;
				font-size: 25rpx;
				letter-spacing: 2rpx;
				color: #fff;
				text-align: center;
				background-color: #f94338;
				border-radius: 120rpx;
				padding: 13rpx 0;
				font-size: 32rpx;
				margin: 10rpx auto 0;
			}
		}
	}

	.mobile-btn {
		background: none;
		padding: 0;
		margin: 0;
		border: none;
		animation: butChange 1s infinite;
		box-shadow: none;
		border-style: none;
		margin-top: 20rpx;
		min-height: 170rpx;

		border::after {
			background: none;
			padding: 0;
			margin: 0;
			border: none;
			content: none;
			border-style: none;
		}

		.submit-btn {

			width: 514rpx;
			height: auto;
			display: block;
			margin: 0 auto;
		}

	}
	.rule-box {
			position: fixed;
			top: 200rpx;
			right: 0;
			text-align: right;
	
			.rule-img {
				width: 100%;
				height: auto;
				margin: 0 auto;
				margin-bottom: 35rpx;
				display: block;
				
			
			}
	.rule-imgs {
				width: 40rpx;
				height: auto;
				margin-bottom: 35rpx;
				display: block;
			}
			.rule-img-btn {
				background: none;
				padding: 0;
				margin: 0;
				border: none;
				box-shadow: none;
				border-style: none;
			
				height: auto;
	
				border::after {
					background: none;
					padding: 0;
					margin: 0;
					border: none;
					content: none;
					border-style: none;
				}
			}
		}
	
	
		.rule-content-box {
			position: fixed;
			width: 100%;
			height: 100vh;
			left: 0;
			top: 0;
			overflow: auto;
			z-index: 9;
	
			.rule-img {
				width: 100%;
				height: auto;
			}
		}
		.agreement-confirm-main-box {
			position: fixed;
			left: 0;
			top: 0;
			width: 100vw;
			height: 100vh;
			display: flex;
			justify-content: center;
			align-items: center;
			background: url("https://qiming-1308147483.cos.ap-chengdu.myqcloud.com/doc%2Fpinzhi_shenghuo_huiyuan_quanyi%2Fcommon%2Flogin-shadow-bg.png") repeat;
			z-index: 2;
		
			.agreement-confirm-box {
				border-radius: 20rpx;
				background-color: #faf7f2;
				padding: 30rpx;
				width: 80%;
				box-sizing: border-box;
				padding: 63rpx 58rpx 38rpx;
		
				.title {
					font-size: 36rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #000000;
					text-align: center;
				}
		
				.content {
					font-size: 28rpx;
					font-family: Source Han Sans CN;
					color: #000000;
					text-align: justify;
					margin-top: 61rpx;
					line-height: 45rpx;
		
					.tip {
						color: #F3D69B;
					}
		
				}
		
				.submit-btn {
					height: 110rpx;
					// line-height: 110rpx;
					background: #3477fc;
					border-radius: 55rpx;
					margin-top: 52rpx;
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #FFFFFF;
					text-align: center;
					display: flex;
					justify-content: center;
					align-items: center;
				}
		
				.cancel-btn {
					text-align: center;
					margin-top: 36rpx;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #999999;
				}
			}
		}
</style>